<template>
	<view>
		<canvas id="canvasRain" canvas-id="canvasRain" style="width: 100vw;height: 100vh;"></canvas>
		<image src="../../static/ttf.jpg" class="rain" mode="aspectFill"></image>
	</view>
</template>

<script>
	import {
		init
	} from "../../utils/rain.js"
	export default {
		data() {
			return {
				ctx: {},
			}
		},
		mounted() {
			this.initCanvas()
		},
		methods: {
			initCanvas() {
				//创建 canvas 绘图上下文（指定 canvasId）
				this.ctx = uni.createCanvasContext('canvasRain')
				init(this.ctx)
				setInterval(() => {
					this.ctx.draw(); //绘制到画布中
				}, 10)

			},
		}
	}
</script>

<style>
	.rain {
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
	}
</style>